<template>
	<!-- 页面容器 -->
	<view class="page-wraper">
		<!-- 页面主体 -->
		<view class="page-main">
			<scroll-view class="page-main-scroll" scroll-y="true" scroll-with-animation="true">
				<view class="page-main-list" v-for="(value, index) in list" :key="index">
					<uni-swipe-action-item>
						<view class="uni-list-cell" hover-class="uni-list-cell-hover">
							<view class="uni-media-list" @click="itemClick(value)">
								<image class="uni-media-list-logo" :src="'/static/home/message_liwu.png'"></image>

								<view class="uni-media-list-body">
									<view class="uni-media-list-text-top">
										<text class="text2">{{ check.isNull(value.content) ? '' : check.encryptMobile(value.content) }}</text>
									</view>
									<view class="uni-media-list-text-bottom">
										<text class="text">{{ check.isNull(value.create_time) ? '' : value.create_time }}</text>
									</view>
								</view>
							</view>
						</view>
						<template v-slot:right>
							<view class="slot-button" @click="bindClick(value)"><text class="slot-button-text">删除</text></view>
						</template>
					</uni-swipe-action-item>
				</view>
			</scroll-view>
		</view>
		 <view v-if="list.length == 0 "><ns-empty :isIndex="false" text="暂无消息"></ns-empty></view>
		 <loading-cover ref="loadingCover"></loading-cover>
	</view>
</template>
<script>
export default {
	mixins: [],
	data() {
		return {
			list: [],
		};
	},
	onLoad() {
			this.getMessageListData();
	},
	methods: {
		  itemClick(e) {
		  	 // console.log(e)
		  	 // var obj = { 
		  	 // 	type: 1,
		  	 // 	address: e
		  	 // }
		  	 // this.$util.redirectTo('/pages/mine/address/address-add',obj,null,'obj');
		  },
		bindClick(e){
			const that = this
			 uni.showModal({
			     content: "确定删除此条信息？",
			     confirmText: "确定",
			     showCancel: true,
			     success: function(res) {
					 if (res.confirm) {
						 that.getMessageDelData(e);
					 }
			     }
			 })
			 
		},
		  
		getMessageListData() {
			// this.$refs.loadingCover.show();
			// this.http.sendRequest({
			// 	api: this.api.home.messageListApi,
			// 	data: {},
			// 	success: res => {

			// 		if (res.success == 'true' && res.data) {
			// 			this.list = res.data.msg_list;
			// 			// console.log(this.list)
			// 		}
			// 		if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
			// 	},
			// 	fail: res =>{
			// 		if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
			// 	}
			// });
		},
		getMessageDelData(e) {
			var data = {
				id: e.id,
			};
			this.http.sendRequest({
				api: this.api.home.messageDeleteApi,
				data: data,
				success: res => {
					if (res.success == 'true' && res.data) {
						 
						 this.getMessageListData();
					}
				}
			});
		}
	}
};
</script>

<style lang="scss">
.page-wraper {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.page-main {
	flex: 1;
	position: relative;
}
.page-main-scroll {
	padding-top: 16rpx;
	padding-bottom: 16rpx;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}
.page-main-list {
	// height: 80rpx;
	// line-height: 80rpx;
	text-align: center;
	// background: #e0e0e0;
}

.btn {
	width: 100%;
	height: 80rpx;
	margin-top: 16rpx;
	margin-left: 64rpx;
	margin-right: 64rpx;
	border-radius: 8rpx;
	// background-color: white;
	border: 1rpx solid $uni-border-color-primary;
	color: $uni-text-color-primary;
	display: flex;
	align-items: center;
	justify-content: center;
}
.address-list-top {
	width: 100%;
	// margin-top: 30px;
	padding: 0px 30px;
}

.uni-list {
	background-color: #eee;
}

.uni-list::after {
	position: absolute;
	z-index: 3;
	right: 0;
	bottom: 0;
	left: 30rpx;
	height: 0px;
	content: '';
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	background-color: #fff;
}
.uni-list-cell {
	margin-bottom: 16rpx;
	border-radius: 0rpx;
}

.uni-list-cell::after {
	position: absolute;
	z-index: 3;
	right: 0;
	bottom: 0;
	left: 30rpx;
	height: 0px;
	content: '';
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	background-color: #fff;
}
/* 图文列表 */
.uni-media-list {
	// padding: 22rpx 30rpx;
	background-color: white;
	// border-radius: 10rpx;
	box-sizing: border-box;
	display: flex;
	width: 100%;
	flex-direction: row;
	align-items: center;
}
.uni-media-list-logo {
	width: 90rpx;
	height: 90rpx;
	margin-right: 20rpx;
}
.uni-media-list-logo image {
	height: 100%;
	width: 100%;
}

.uni-media-list-body {
	height: auto;
	justify-content: space-around;
}

.uni-media-list-text-top {
	// height: 74rpx;
	font-size: 28rpx;
	// overflow: hidden;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	padding-top: 8rpx;
	padding-bottom: 8rpx;

	.text {
		font-size: 30rpx;
		margin-top: 0rpx;
		color: #333;
	}
	.text2 {
		color: #333;
		text-align: left;
		font-size: 28rpx;
	}
}

.uni-media-list-text-bottom {
	display: flex;
	flex-direction: row;
	font-size: 28rpx;
	justify-content: flex-start;
	padding-top: 8rpx;
	padding-bottom: 8rpx;
}

.text {
	padding-right: 16rpx;
	font-size: 26rpx;
	text-align: left;
	color: #8f8f94;
}

.slot-button {
	/* #ifndef APP-NVUE */
	display: flex;
	height: 100%;
	/* #endif */
	flex: 1;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 0 20px;
	background-color: #ff5a5f;
	margin-bottom: 16rpx;
}

.slot-button-text {
	color: #ffffff;
	font-size: 14px;
}
.button-group--right {
	margin-bottom: 16rpx;
	right: 0;
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
}
</style>
